<script setup>
import ProjectCard from '@/components/ProjectCard.vue';

const projects = ref([
  { name: '项目1', description: '描述...', github: 'https://github.com/...' },
  { name: '项目2', description: '描述...', github: 'https://github.com/...' }
]);
</script>

<template>
    <div class="wrapper">
        <div class="projects">
            <ProjectCard v-for="project in projects" :key="project.name" :project="project" />
        </div>
    </div>
</template>

<style lang="scss" scoped>
.wrapper {
    width: 100%;

    .projects {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
        gap: var(--gap);
    }
}
</style>